const webpack = require('webpack')
const path = require('path')
const TerserPlugin = require('terser-webpack-plugin')  //js压缩
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')  //css压缩
const MiniCssExtractPlugin = require('mini-css-extract-plugin')  //css文件提取，生产环境使用
const { CleanWebpackPlugin } = require('clean-webpack-plugin')  //清除上一次打包结果目录
const { merge } = require('webpack-merge')  //webpack配置合并
const common = require('./webpack.common.js')

module.exports = merge(common, {
    mode: 'production',
    output: {
        path: path.resolve('dist'),
        publicPath: '/react-admin-template/',  //输出静态文件二级目录
        // publicPath: '',
        filename: 'static/js/[name].[chunkhash].js'  //打包后的文件
    },
    externals: {  //开启cdn加载
        'react': 'React',
        'react-dom': 'ReactDOM'
    },
    devtool: 'none',
    optimization: {
        minimize: true,
        minimizer: [
            new CssMinimizerPlugin(),
            new TerserPlugin()
        ],
        splitChunks: {
            chunks: 'all',
            name: 'vendor'
        }
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env.BASE_URL': JSON.stringify('http://42.193.144.245:3000')
        }),
        new webpack.HashedModuleIdsPlugin(),  //未改动的包保持hash不变
        new CleanWebpackPlugin(),
        new MiniCssExtractPlugin({
            filename: 'static/css/[name].[contenthash].css',
            chunkFilename: 'static/css/[name].[contenthash].css'  
        })
    ]
})